<template>
	<view v-if="show">
		<Header title=" " :showBack="true"></Header>
		<!-- <view class="tab">
			<view>签约</view>
			<view>交易</view>
		</view> -->
		<view class="content">
			<view class="allNum">班级总人数：{{allInfo.totalCount}}</view>
			<view class="allBox">
				<view>签约累计人数</view>
				<view>
					<view>
						<view>签约人数</view>
						<view>{{allInfo.totalSignCount}}</view>
					</view>
					<view>
						<view>未签约人数</view>
						<view>{{allInfo.totalNoSignCount}}</view>
					</view>
					<view>
						<view>签约率</view>
						<view>{{allInfo.signRate}}</view>
					</view>
				</view>
			</view>
			<view class="bottom">
				<view>
					<view>学生姓名</view>
					<input v-model="studentName" type="text" value="" />
					<view @click="summit" class="button">查询</view>
				</view>
				<view>
					<view>
						<view class="tit">是否采脸</view>
						<picker style="width: 50%; height: 100%;border: 1upx solid #CCCCCC;border-radius: 12upx;" range-key="label" mode="selector" :range="check" @change="change($event,2)">
							<view style="width: 100%;height: 100%;line-height: 60upx;text-align: center;">{{isGather=="none"?'不限制':(isGather?'是':'否')}}</view>
						</picker>
					</view>
					<view>
						<view class="tit">是否签约</view>
						<picker style="width: 50%; height: 100%;border: 1upx solid #CCCCCC;border-radius: 12upx;" range-key="label" mode="selector" :range="check" @change="change($event,3)">
							<view style="width: 100%;height: 100%;line-height: 60upx;text-align: center;">{{isSign=="none"?'不限制':(isSign?'是':'否')}}</view>
						</picker>
					</view>
				</view>
				<view class="table">
					<view>
						<view>姓名</view>
						<view>是否采集</view>
						<view>是否签约</view>
						<view>签约时间</view>
					</view>
					<view v-for="(item,index) in studentList" :key="index" :style="{'background-color': index%2==0?'':'#eeeeee'}">
						<view>{{item.ownerName}}</view>
						<view>{{item.isGather?'是':'否'}}</view>
						<view>{{item.isSign?'是':'否'}}</view>
						<view style="font-size: 20upx;">{{item.signTime||''}}</view>
						<view>
							<view @click="toSaolian(item)" v-if="item.isGather" style="background-color: #F3B92A; border: 1upx solid #F3B92A;">修改</view>
							<button @click="getTitle(item)" v-if="item.isGather&&!item.isSign" open-type="share" style="background-color: #07C160;">转发</button>
							<view @click="toSaolian(item,item.isGather)" :class="{'active':item.isGather}">{{item.isGather?'已采集':'去采集'}}</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				show: false,
				title: '',
				allInfo: {},
				signList: [],
				isGather: 'none',
				isSign: 'none',
				studentList: [],
				studentName: '',
				check: [{
						value: 'none',
						label: '不限'
					},
					{
						value: true,
						label: '是'
					},
					{
						value: false,
						label: '否'
					}
				],
			}
		},
		onShow() {
			this.getSignList()
		},
		async onShareAppMessage(res) {
			if (res.from === 'button') { // 来自页面内分享按钮
				await new Promise((suc, fal) => {
					setTimeout(() => {
						suc('')
					}, 0)
				})
				return {
					title: this.title,
					imageUrl: this.baseUrl + '/images/img/img6.jpg',
					path: '/pages/index/index'
				}
			}
		},
		methods: {
			getTitle(item) {
				this.title = item.organizationName + '-' + item.gradeName + '-' + item.ownerName
			},
			decryptPhone(value) {
				if (value === null || value === undefined || value.trim() === '') {
				  return Promise.resolve('');
				}
				return new Promise((resolve,reject)=>{
					// if (value.length > 20 && /[0-9]/.test(value) && /[a-zA-Z]/.test(value)) {
					// if (/[0-9]/.test(value) && /[a-zA-Z]/.test(value)) {
						this.$http('/kernel/api/privacy/decryptPhone',{"CipherTexts":[value] }, res=>{
							if(res.data.data.length>0){
									resolve(res.data.data[0].phone) 
								}else{
									resolve(value)
								}
						})
					// }else{
						// resolve(value)
					// }
				})
			},
			async toSaolian(item, flag) {
				if (flag) return;
				let signPhone = await this.decryptPhone(item.phone)
				let studentName = await this.decryptPhone(item.ownerName)
				this.$http('/pay/api/offlineFacePay/getToken', {
					"organization_id": item.wxOrganizationId,
					"out_user_id": item.id.replace(/-/g, "")
				}, res => {
					let schoolList = []
					schoolList.push(item.organizationName)
					wx.navigateToMiniProgram({
						appId: 'wx5931af4836330935', //采集小程序appid
						path: '/pages/face_take_photos/take_photos?is_first=1', //小程序路径
						extraData: {
							type: 'take_photo', //采集跳转
							user_name: studentName, //刷脸用户姓名
							school_name: item.organizationName, //学校
							cert_info: {
								'cert_type': 'IDCARD',
								'cert_id': '123',
								'name': studentName
							}, //cert_type:IDCARD（身份证）,EEP_HK_MACAU（港澳通行证）,PASSPORT_NO（护照）；cert_id:证件号;name:姓名
							user_type: 'STUDENT', //职业(STUDENT：学生,STAFF：职员)
							student_info: {
								'class_name': item.gradeName
							}, //class_name:班级。student_info和staff_info二选一
							// staff_info:{'occupation':'教师'}, //occupation:职业 student_info和staff_info二选一
							school_list: schoolList, //学校列表
							organization_id: item.wxOrganizationId, //organazition_id
							out_user_id: item.id.replace(/-/g, ""), //out_user_id
							account: signPhone, //签约手机号
							token: res.data.token
						},
						// envVersion: 'trial',    // 如果要跳转体验版，加上这个参数，否则请不要加这个参数
						success(res1) {
							// 成功跳转到签约小程序 
							uni.setStorageSync('id', item.id)
						}
					})
				})
			},
			change(e, type) {
				if (type == 1) {} else if (type == 2) {
					this.isGather = this.check[e.detail.value].value
				} else if (type == 3) {
					this.isSign = this.check[e.detail.value].value
				}
			},
			summit() {
				this.getSignList()
			},
			getSignList() {
				this.$http('/member/api/memberCard/StatisticsTeacherMemberCard', {
					condition: {
						memberCardId: uni.getStorageSync('info').id,
					}
				}, res => {
					this.allInfo = res.data
					this.show = true
				})
				this.$http('/member/api/memberCard/getTeacherMemberCardList', {
					condition: {
						"memberCardId": uni.getStorageSync('info').id,
						"ownerName": this.studentName,
						"isGather": this.isGather == 'none' ? '' : this.isGather,
						"isSign": this.isSign == 'none' ? '' : this.isSign,
						"isGatherQuery": true
						
					},
					"pageSize": 999,
					"pageNum": 1
				}, async res => {
					this.studentList = res.data.items
					for (let item of this.studentList) {
					  item.ownerName = await this.decryptPhone(item.ownerName); 
					}
				})
			}
		}
	}
</script>

<style lang="less" scoped>
	.tab {
		width: 100%;
		box-sizing: border-box;
		padding: 0 20upx;
		display: flex;
		justify-content: space-between;
		margin-top: 30upx;
		>view {
			width: 48%;
			border-radius: 8upx;
			background-color: #FFFFFF;
			text-align: center;
			height: 60upx;
			line-height: 60upx;
			font-size: 26upx;
		}
	}
	.content {
		width: 100%;
		box-sizing: border-box;
		padding: 0 20upx;
		>view {
			background-color: #FFFFFF;
			border-radius: 10upx;
			margin-top: 25upx;
		}
		>.allNum {
			width: 100%;
			height: 90upx;
			line-height: 90upx;
			font-size: 30upx;
			text-indent: 30upx;
		}
		>.allBox {
			padding: 45upx 0;
			>view:first-child {
				width: 100%;
				text-indent: 30upx;
				font-size: 28upx;
			}
			>view:last-child {
				display: grid;
				grid-template-columns: repeat(3, 1fr);
				margin-top: 50upx;
				>view {
					text-align: center;
					>view:first-child {
						font-size: 22upx;
						color: #999999;
					}
					>view:last-child {
						font-size: 26upx;
						font-weight: 600;
						margin-top: 25upx;
					}
				}
			}
		}

		>.bottom {
			font-size: 24upx;
			padding: 20upx;
			>view:first-child {
				height: 50upx;
				display: flex;
				align-items: center;
				>view:first-child {
					width: 180upx;
					text-align: center;
					margin-right: 20upx;
				}
				>input {
					border: 1upx solid #CCCCCC;
					height: 40upx;
					font-size: 26upx;
					padding: 0 20upx;
					border-radius: 10upx;
				}
				>.button {
					width: 180upx;
					height: 50upx;
					line-height: 50upx;
					font-size: 24upx;
					background: #19BE6B;
					padding: 0;
					color: #FFFFFF;
					text-align: center;
					border-radius: 12upx;
					margin: 0 0 0 20upx;
					position: relative;
				}
			}
			>view:nth-child(2) {
				width: 100%;
				display: flex;
				height: 60upx;
				margin: 40upx auto;
				>view {
					width: 50%;
					display: flex;
					>view.tit {
						width: 50%;
						text-align: center;
						height: 60upx;
						line-height: 60upx;
					}
				}
			}
			>.table {
				width: 100%;
				border: 1upx solid #dddddd;
				>view {
					display: flex;
					height: 100upx;
					>view {
						width: 15%;
						height: 100%;
						border-bottom: 1upx solid #dddddd;
						border-right: 1upx solid #dddddd;
						display: flex;
						justify-content: center;
						align-items: center;
						text-align: center;
						box-sizing: border-box;
					}
					>view:nth-child(5n) {
						width: 40%;
						display: flex;
						justify-content: center;
						>view,
						button {
							background-color: #07C160;
							border: 1upx solid #07C160;
							color: #FFFFFF;
							font-size: 20upx;
							width: 75upx;
							height: 38upx;
							border-radius: 8upx;
							line-height: 38upx;
							text-align: center;
							margin: 0 5upx;
							padding: 0;
							box-sizing: border-box;
						}
						>view:last-child.active {
							color: #07C160;
							background-color: #FFFFFF;
						}
					}
				}
				>view:first-child {
					height: 60upx;
					background-color: #cccccc;
				}
			}
		}
	}
</style>
